<template>
  <div>
    <router-link to="/find">发现音乐</router-link> |
    <router-link to="/my">我的音乐</router-link>
    <!-- 7、挂载点 -->
    <router-view></router-view>
  </div>
</template>

<script>
/**
 * router-link提供的两个激活类名的区别
 * router-link-exact-active：（精确匹配）浏览器地址栏url中路径，和导航a标签中href属性的值完全相同的时候，则给该a标签添加类名
 * router-link-active：（模糊匹配）浏览器地址URL中的路径包含导航a标签中的href属性的值的时候，则给该a标签添加此类名
 *
 * 使用场景
 */
export default {};
</script>

<style scoped>
.router-link-active {
  background-color: skyblue;
  color: #000;
}
</style>